﻿@model IDictionary<string, object>
@{
    ViewBag.Title = "交易详情";
    Layout = "~/Views/Shared/_MemberCenterLayout.cshtml";
}
@section Styles
{
    <style type="text/css">
        a
        {
            color: #3366CC;
            text-decoration: none;
        }
        .crumbs a
        {
            background: url("http://a.tbcdn.cn/sys/common/img/crumb_bg.gif") no-repeat scroll 100% 50% transparent;
            margin-right: 1px;
            padding-right: 8px;
        }
        
        .grid-c:after, .grid-c2-s4:after, .grid-c2-s4f:after, .grid-c2:after, .grid-c2f:after, .grid-c2-s6:after, .grid-c2-s6f:after, .grid-c2-s7:after, .grid-c2-s7f:after, .grid-c2-s8:after, .grid-c2-s8f:after, .grid-c2-s9:after, .grid-c2-s9f:after, .grid-c2-s10:after, .grid-c2-s10f:after, .grid-c2-s11:after, .grid-c2-s11f:after, .grid-c2-s12:after, .grid-c2-s12f:after, .grid-c3:after, .grid-c3f:after, .grid-c3e:after, .grid-c3d:after, .grid-c3c:after, .grid-c3b:after, .grid-c3-s5e7:after, .grid-c3-s5e7f:after, .grid-c3-s5e7e:after, .grid-c3-s5e7d:after, .grid-c3-s5e7c:after, .grid-c3-s5e7b:after, .grid-c3-s9e6:after, .grid-c3-s9e6f:after, .grid-c3-s9e6e:after, .grid-c3-s9e6d:after, .grid-c3-s9e6c:after, .grid-c3-s9e6b:after, .grid-c3-s8e8:after, .main-wrap:after, .col-sub:after, .col-extra:after
        {
            clear: both;
            content: " ";
            display: block;
            height: 0;
        }
        .order-dashboard
        {
            margin-top: 10px;
        }
        .box
        {
            margin-bottom: 10px;
            position: relative;
        }
        .box .bd
        {
            background-color: #F7F7F7;
            border: 1px solid #CCCCCC;
            padding: 10px;
        }
        .order-dashboard .bd
        {
            background: none repeat scroll 0 0 #FFFCF3;
            border: 1px solid #F7E4A5;
            padding: 20px 30px;
        }
        .order-dashboard .trade-status
        {
            float: none;
            font-size: 12px;
        }
        .order-dashboard .trade-status strong
        {
            display: block;
            font-size: 14px;
            margin-bottom: 5px;
        }
        .trade-status .wait
        {
            color: #404040;
        }
        .order-dashboard .trade-status .wait-reason
        {
            color: #999999;
        }
        .tabs-container
        {
            margin: 20px 0;
            position: relative;
        }
        .tabs-nav
        {
            left: 20px;
            position: absolute;
            z-index: 50;
        }
        .tabs-nav .current
        {
            background-position: 0 -40px;
        }
        .tabs-nav li
        {
            background: url("http://a.tbcdn.cn/app/trade/img/tabview_bg.gif") no-repeat scroll 0 6px transparent;
            cursor: pointer;
            float: left;
            height: 27px;
            line-height: 21px;
            margin-right: 3px;
            padding-top: 8px;
            text-align: center;
            width: 130px;
        }
        .tabs-nav a
        {
            color: #111111 !important;
            display: block;
            width: 130px;
        }
        .tabs-nav .current a
        {
            color: #333333;
            font-size: 14px;
            font-weight: bold;
        }
        
        .tabs-panels
        {
            clear: both;
            height: auto;
            margin-bottom: 10px;
            overflow: hidden;
            padding: 10px 20px;
        }
        .tabs-container .tabs-panels
        {
            border: 1px solid #AEC7E5;
            margin-bottom: 40px;
            position: relative;
            top: 29px;
        }
        .info-box table
        {
            table-layout: fixed;
            width: 910px;
        }
        .info-box td, .info-box th
        {
            line-height: 1.5;
            padding: 2px 10px;
            word-wrap: break-word;
        }
        caption, th
        {
            text-align: left;
        }
        .order-info .misc-info td, .order-info .contact-info td, .order-info .dealer-info td
        {
            padding: 5px 10px;
        }
        .order-info .contact-info .nickname, .order-info .contact-info .name, .order-info .contact-info .mail
        {
            margin-right: 10px;
        }
        .ww-light
        {
            overflow: hidden;
        }
        .ww-large a
        {
            width: 67px;
        }
        .ww-light a
        {
            background: url("http://img04.taobaocdn.com/tps/i4/T1UPFAXnNfXXXXXXXX-130-60.gif") no-repeat scroll 0 0 transparent;
            height: 20px;
            text-decoration: none !important;
            width: 20px;
        }
        .ww-light a span
        {
            display: none;
        }
        .ww-inline
        {
            display: inline-block;
            vertical-align: text-bottom;
        }
        .order-info .sep-row td
        {
            clear: both;
        }
        .order-info .sep-row td
        {
            border-bottom: 1px solid #DDDDDD;
        }
        .info-box td, .info-box th
        {
            line-height: 1.5;
            padding: 2px 10px;
            word-wrap: break-word;
        }
        .order-info .misc-info .label
        {
            display: block;
            float: left;
            margin-right: 10px;
            text-align: right;
            width: 90px;
        }
        .order-hd
        {
            background: none repeat scroll 0 0 #E8F2FF;
            color: #404040;
        }
        .order-info .order-hd th
        {
            border-bottom: 1px solid #DDDDDD;
        }
        .order-info .order th, .order-info .order td
        {
            line-height: 130%;
            overflow: hidden;
            text-align: center;
            font-style: normal;
            font-weight: normal;
        }
        .order-info .order .item
        {
            border-left: 1px solid #DDDDDD;
        }
        .order-item .item .pic-info
        {
            float: left;
            margin-right: 5px;
        }
        .order-item .pic-info .pic
        {
            border: medium none;
            overflow: hidden;
        }
        .s50, .s50 a
        {
            height: 50px;
            width: 50px;
        }
        .order-item .item .txt-info
        {
            line-height: 18px;
            margin-left: 55px;
            text-align: left;
        }
        .order-info .txt-info
        {
            color: #808080;
        }
        .order-info .txt-info .desc
        {
            color: #404040;
        }
        .order-item .item .desc a.xiaobao
        {
            margin-left: 3px;
            position: relative;
            top: 2px;
            width: 16px;
        }
        .order-info .order-item .sku
        {
            color: #808080;
        }
        .order-info .order-item .sku span
        {
            display: block;
        }
        .refund-reason
        {
            display: block;
        }
        .order-info .order-item td.post-fee
        {
            border-right: 1px solid #DDDDDD;
            line-height: 22px;
            vertical-align: middle;
        }
        .order-info .order-ft td
        {
            -moz-border-bottom-colors: none;
            -moz-border-image: none;
            -moz-border-left-colors: none;
            -moz-border-right-colors: none;
            -moz-border-top-colors: none;
            border-color: #CCCCCC -moz-use-text-color -moz-use-text-color;
            border-right: medium none;
            border-style: solid none none;
            border-width: 1px medium medium;
        }
        .order-info .order-ft .get-money, .order-info .order-ft .trade-money
        {
            clear: both;
            display: inline;
            float: right;
            line-height: 23px;
            text-align: right;
        }
        .order-info .order-ft .get-money strong
        {
            color: #FF5500;
            font-size: 16px;
            font-weight: bold;
            padding-right: 5px;
        }
        .logistics-list
        {
            width: 100% !important;
        }
        .simple-list
        {
            margin-bottom: 20px;
        }
        .simple-list th
        {
            text-align: right;
            vertical-align: top;
            width: 90px;
        }
        .simple-list th, .simple-list td
        {
            border-bottom: 1px solid #EEEEDD;
            padding: 7px 10px;
        }
        .logistics-list th
        {
            text-align: left;
            width: auto;
        }
        
        .logistics-list .label
        {
            text-align: right;
            width: 90px;
        }
    </style>
}
@section Scripts
{
}
<div class="main pageWidth pb">
    <div id="nav-crumbs" class="crumbs">
        您的位置： <a href="http://www.taobao.com/">首页</a> <a href="http://i.taobao.com/my_taobao.htm?nekot=1345114968580">
            我的淘宝</a> <a href="http://trade.taobao.com/trade/itemlist/list_bought_items.htm?nekot=1345114968580">
                已买到的宝贝</a>
    </div>
    <div id="detail-panel" class="grid-c">
        <div class="box order-dashboard">
            <div class="bd">
                <div class="trade-status">
                    <strong>当前订单状态：<span class="wait">交易关闭</span> </strong><span class="wait-reason">取消原因：其他原因</span>
                </div>
                <!--交易成功情况-->
            </div>
        </div>
        <div class="tabs-container" id="J_TabView">
            <ul class="tabs-nav">
                <li class="current"><a name="tab0">订单信息</a></li>
            </ul>
            <div class="tabs-panels">
                <div style="display: block;" class="info-box order-info">
                    <div class="bd">
                        <table>
                            <colgroup>
                                <col width="280">
                                <col width="110">
                                <!-- 宝贝 -->
                                <col class="col1">
                                <!-- 交易状态 -->
                                <col class="col2">
                                <!-- 单价（元） -->
                                <col class="col3">
                                <!-- 数量 -->
                                <col class="col4">
                                <!-- 优惠 -->
                                <col class="col5">
                                <!-- 合计（元） -->
                                <col class="col6">
                                <!-- 运费（元） -->
                                <!-- 买/卖家信息 -->
                            </colgroup>
                            <tbody class="contact-info">
                                <tr>
                                    <th colspan="8">
                                        <h4>
                                            卖家信息</h4>
                                    </th>
                                </tr>
                                <tr>
                                    <td>
                                        昵称： <span class="nickname">布丁可爱5555</span>
                                    </td>
                                    <td colspan="3">
                                        真实姓名： <span class="name">董连清</span>
                                    </td>
                                    <td colspan="4">
                                        城市：<span class="city">浙江 嘉兴</span>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        联系电话：<span class="tel">138-68129714</span>
                                    </td>
                                    <td colspan="3">
                                        邮件：<a href="mailto:278371937@qq.com" class="mail">278371937@qq.com</a> <a href="http://member1.taobao.com/message/add_private_msg.htm?recipient_nickname=%B2%BC%B6%A1%BF%C9%B0%AE5555"
                                            target="_blank">发送站内信</a>
                                    </td>
                                    <td colspan="4">
                                        支<span style="padding: 0.5em;">付</span>宝：<a href="mailto:278371937@qq.com" class="alipay">278371937@qq.com</a>
                                    </td>
                                </tr>
                            </tbody>
                            <!-- 订单信息 -->
                            @if (Model["Orderinfo"] != null)
                            {
                                int index = 1;
                                Enter.Mvc.Mall.Model.Order.OrderModel order = (Enter.Mvc.Mall.Model.Order.OrderModel)Model["Orderinfo"];
                          
                                <tbody class="misc-info">
                                    <tr class="sep-row">
                                        <td colspan="8">
                                        </td>
                                    </tr>
                                    <tr>
                                        <th colspan="8">
                                            <h4>
                                                订单信息</h4>
                                        </th>
                                    </tr>
                                    <tr>
                                        <td>
                                            <span class="label">订单编号：</span> <span class="order-num">@order.OrderNO</span>
                                        </td>
                                        <td colspan="3">
                                            <span class="label">支付交易号：</span> <span class="alilay-num"></span>
                                        </td>
                                        <td colspan="4">
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <span class="label">成交时间：</span> <span class="trade-time">@order.AddTime</span>
                                        </td>
                                        <td colspan="3">
                                            @if (string.IsNullOrEmpty(@order.PayTime))
                                            { 
                                                <span class="label">支付时间：</span> <span class="trade-time">@order.PayTime</span>
                                            }
                                        </td>
                                        <td colspan="4">
                                            @if (string.IsNullOrEmpty(@order.EndTime))
                                            { 
                                                <span class="label">支付时间：</span> <span class="trade-time">@order.EndTime</span>
                                            }
                                        </td>
                                    </tr>
                                </tbody>
                                <!-- 订单信息 -->
                                <tbody class="order">
                                    <tr class="sep-row">
                                        <td colspan="8">
                                        </td>
                                    </tr>
                                    <tr class="order-hd">
                                        <th class="item">
                                            宝贝
                                        </th>
                                        <th class="sku">
                                            宝贝属性
                                        </th>
                                        <th class="status">
                                            状态
                                        </th>
                                        <th class="price">
                                            单价(元)
                                        </th>
                                        <th class="num">
                                            数量
                                        </th>
                                        <th class="discount">
                                            优惠
                                        </th>
                                        <th class="order-price">
                                            商品总价(元)
                                        </th>
                                        <th class="post-fee">
                                            运费(元)
                                        </th>
                                    </tr>
                                    
                                    @foreach (Enter.Mvc.Mall.Model.Order.Order_ItemsModel item in @order.items)
                                    {
                                        <tr class="order-item">
                                            <td class="item">
                                                <div class="pic-info">
                                                    <div class="pic s50">
                                                        <a href="http://tradearchive.taobao.com/trade/detail/trade_snap.htm?trade_id=136010951907837"
                                                            target="_blank" title="商品图片">
                                                            <img alt="" src="@item.SmallImgUrl">
                                                        </a>
                                                    </div>
                                                </div>
                                                <div class="txt-info">
                                                    <div class="desc">
                                                        <span class="name"><a href="http://tradearchive.taobao.com/trade/detail/trade_snap.htm?trade_id=136010951907837"
                                                            title="@item.ProdTitle" target="_blank">@item.ProdTitle</a></span>
                                                    </div>
                                                </div>
                                            </td>
                                            <td class="sku">
                                                <div class="props">
                                                    @if (!string.IsNullOrEmpty(item.ColorName))
                                                    {
                                                        <span>颜色分类: @item.ColorName</span>
                                                    }
                                                    @if (!string.IsNullOrEmpty(item.SizeName))
                                                    {<span>尺码: @item.SizeName</span>
                                                    }</div>
                                            </td>
                                            <td class="status">
                                                已取消
                                            </td>
                                            <td class="price">
                                                @item.OPRICE.ToString("f2")
                                            </td>
                                            <td class="num">
                                                @item.ONUM
                                            </td>
                                            <td class="discount">
                                                
                                            </td>
                                            @if (index == 1)
                                            {
                                            <td class="order-price" rowspan="@order.items.Count">
                                                @order.GoodAmount.ToString("f2")
                                            </td>
                                            <td class="post-fee" rowspan="@order.items.Count">
                                                <span>@order.YunFei.ToString("f2")</span>
                                                <br>
                                                ( 快递 )
                                            </td>
                                            }
                                            
                                        </tr>
                                        index++;
                                    }
                                    <tr class="order-ft">
                                        <td colspan="8">
                                            <div class="get-money" colspan="6">
                                                <br>
                                                实付款： <strong>@order.AMOUNT.ToString()</strong>元<br>
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            }
                        </table>
                        <table class="simple-list logistics-list">
                            <colgroup>
                                <col class="label">
                                <col class="info">
                                <col>
                            </colgroup>
                            <tbody>
                                <tr class="sep-row">
                                    <td colspan="3">
                                    </td>
                                </tr>
                                <tr>
                                    <th colspan="3">
                                        <h4>
                                            物流信息</h4>
                                    </th>
                                </tr>
                                <tr>
                                    <td class="label">
                                        收货地址：
                                    </td>
                                    <td>
                                        虞秋杰 ，15011240651 ， ，北京 北京市 海淀区 上地十街辉煌国际西6号楼202室 ，100085
                                    </td>
                                    <td>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="label">
                                        运送方式：
                                    </td>
                                    <td>
                                        快递
                                    </td>
                                    <td>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="label">
                                        物流公司：
                                    </td>
                                    <td>
                                        —
                                    </td>
                                    <td>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="label">
                                        运单号：
                                    </td>
                                    <td>
                                        —
                                    </td>
                                    <td>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="label">
                                        买家留言：
                                    </td>
                                    <td>
                                        <span id="J_ExistMessage"></span>
                                    </td>
                                    <td>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
